<template>
  <div id="address">
    <van-row class="bgc">
      <van-col span="24">
        <van-nav-bar title="地址管理" left-text="返回" left-arrow @click-left="onClickLeft" />
      </van-col>
      <van-col span="24" class="centenr" v-for="(item, index) in GetDataList" :key="item.id" @click="onAddOrder(item)">
        <div>
          <van-col span="3" class="checkbox">
            <van-checkbox v-model="checked"></van-checkbox>
          </van-col>
          <van-col span="17" class="province">
            <p>
              {{ item.name }} <span>{{ item.tel }}<van-tag v-if="item.isDefault" type="danger">默认</van-tag></span>
            </p>
            <p>{{ item.province }}{{ item.city }}{{ item.county }}{{ item.addressDetail }}</p>
          </van-col>
          <van-col span="4" class="edit">
            <van-icon name="edit" @click="onGoAddress(item)" />
          </van-col>
        </div>
      </van-col>
      <van-col span="24">
        <van-button type="danger" size="large" class="btn" @click="onAdd">添加地址</van-button>
      </van-col>
    </van-row>
  </div>
</template>
<script>
export default {
  name,
  data() {
    return {
      chosenAddressId: '1',
      GetDataList: {},
      checked: false
    }
  },
  mounted() {
    this.onGetRessList()
  },
  methods: {
    onClickLeft() {
      this.$router.back()
    },
    // 添加 当前的 地址信息 存起来
    onAddOrder(item) {
      if (this.$route.query.Status) {
        // 通过vuex 保存数据 然后在获取
        this.$store.commit('PassRessItem', item)
        console.log(item)
        this.$router.back()
        // 通过事件总线把数据广播，然后在接收
        // this.$root.$emit('GetOeder', item)
        // this.$router.back()
      }
    },
    onAdd() {
      this.$router.push('/address')
    },
    onGoAddress(item) {
      this.$router.push({ path: '/reviseress', query: item })
    },
    onEdit(item, index) {},
    // 获取地址信息
    onGetRessList() {
      this.$get('address/list')
        .then(result => {
          this.GetDataList = result.data.data.list
        })
        .catch(err => {})
    }
  }
}
</script>
<style lang="less" scoped>
.btn {
  position: absolute;
  bottom: 0;
}
.centenr {
  padding: 0.1rem;
  div {
    background-color: #fff;
    height: 100px;
    .province {
      p:nth-child(1) {
        padding: 0.1rem 0rem;
        font-weight: 600;
        span {
          .van-tag {
            margin: -5px 5px 5px 5px;
          }
        }
      }
      p:nth-child(2) {
        font-size: 0.14rem;
      }
    }
    .checkbox {
      .van-checkbox {
        padding-left: 0.1rem;
      }
    }
    .edit {
      text-align: center;
      line-height: 100px;
    }
  }
}
</style>
